import React from 'react'
import './DateMonsterBtn.css'

const DateMonsterBtn = props => {
    const {date,} = props
    const year = date.slice(0, 4)
    const month = date.slice(4, 6)
    const day = date.slice(6)
    const dateString = `${year}-${month}-${day}`

    const i = new Date(dateString).getDay()
    // console.log(i)
    const arr = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六",]

    const dateSpan = <div
        style={{
            height: '24px',
            width: '100%',
            top: 0,
            background: '#EAEAEA',
            textAlign: 'center',
            // position: 'fixed',
            // top: 88.5,
            // left: 0,
            zIndex: 2,
        }}
        // className='recent-ai-date-span'
        // className={index === 0
        //     ? 'recent-ai-date-span recent-ai-date-span-fixed'
        //     : 'recent-ai-date-span'
        // }
    >
        <span style={{
            lineHeight: '24px',
        }}>{dateString} {arr[i]}</span>
    </div>

    return dateSpan

    return (
        <div style={{height: '56px', paddingTop: '16px',}}>
            <div
                className='data-monster-btn flex-space-between'
            >
                <span>{dateString} </span>
                <span>{arr[i]}</span>
            </div>
        </div>

    )
}

export default DateMonsterBtn
